<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>恒铸智能柜管理平台</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<link rel="stylesheet"
	href="${pageContext.request.contextPath}/resources/layui/css/layui.css"
	media="all" />
<script type="text/javascript"
	src="${pageContext.request.contextPath}/resources/layui/layui.js"></script>
</head>
<style>
.laytable-cell-1-url {
	width: 340px !important;
}
</style>
<body class="childrenBody">
	<form class="layui-form" />
	<div class="layui-form-item" style="margin: 10px 0 -10px 0">
		<%--<div class="layui-inline" style="display: block;margin: auto;width: 730px;">--%>
		<%--<div class="layui-form-item">--%>
		<%--<label class="layui-form-label">查询条件：</label>--%>
		<%--<div class="layui-input-inline">--%>
		<%--<input class="layui-input" name="startTime" autocomplete="off" placeholder="到期日期" id="begin">--%>
		<%--</div>--%>
		<%--<div class="layui-form-mid layui-word-aux" id="msg">--</div>--%>
		<%--<div class="layui-input-inline">--%>
		<%--<input class="layui-input" name="endTime" autocomplete="off" placeholder="到期日期" id="end">--%>
		<%--</div>--%>
		<%--<div class="layui-input-inline">--%>
		<%--<button class="layui-btn" id="button" type="button">提交</button>--%>
		<%--</div>--%>
		<%--</div>--%>

		<%--</div>--%>
		<style>
.layui-form-item {
	display: inline-block;
}
</style>
		<div class="layui-form-item select">
			<label class="layui-form-label">用途:</label>
			<div class="layui-input-block">
				<select name="interest" lay-filter="select">
					<c:forEach items="${type }" var="list">
						<option value="${list.kindId }">${list.kindName }(${list.num })</option>
					</c:forEach>
				</select>
			</div>
		</div>


		<div class="layui-form-item selectComp">
			<label class="layui-form-label">公司:</label>
			<div class="layui-input-block">
				<select name="interest" lay-filter="selectComp">
					<option value="-1">全部</option>
					<c:forEach items="${comps }" var="list">
						<option value="${list.compId }">${list.compName }</option>
					</c:forEach>
				</select>
			</div>
		</div>

		<div class="demoTable layui-form-item like">
			<label class="layui-form-label">搜索：</label>
			<div class="layui-inline">
				<input class="layui-input" id="like" name="like" autocomplete="off"
					placeholder="请输入ID">
				<dl style="display: none;"></dl>
			</div>
			<a class="layui-btn" style="margin-top: -4px;">搜索</a>
		</div>
	</div>
	</form>
	<table id="useTime" lay-filter="useTime"></table>

	<!--操作-->
	<script type="text/html" id="publish">
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="edit">编辑</a>
</script>
	<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn" lay-event="getCheckData">批量编辑</a>
    </div>
</script>
	<script>
    layui.use(['form', 'layer', 'laydate', 'table', 'laytpl'], function () {
        var form = layui.form,
            layer = parent.layer === undefined ? layui.layer : top.layer,
            $ = layui.jquery,
            laydate = layui.laydate,
            laytpl = layui.laytpl,
            table = layui.table;

        var tableIns = table.render({
            elem: '#useTime',
            url: '/caseUseTime/list',
            cellMinWidth: 95,
            toolbar: '#toolbar',
            defaultToolbar: "",
            page: true,
            height: "full-100",
            limit: 10,
            limits: [10, 15, 20, 25],
            id: "useTime",
            cols: [[
                {type: 'checkbox', fixed: 'left'},
                {field: 'caseNo', title: 'ID', align: 'center'},
                {field: 'latitude', title: '纬度', align: 'center'},
                {field: 'longitude', title: '经度', align: 'center'},
                {field: 'des', title: '描述', align: 'center', edit: 'text'},
                {field: 'useTime', title: '使用到期时间', align: 'center'},
                {title: '操作', width: 90, templet: '#publish', fixed: "right", align: "center"}
            ]]
        });


        layui.use('table', function () {
            var table = layui.table;

            //监听单元格编辑
            table.on('edit(useTime)', function (obj) {
                var value = obj.value //得到修改后的值
                    , data = obj.data //得到所在行所有键值
                    , field = obj.field; //得到字段
//     	    layer.msg('[ID: '+ data.useTimeId +'] ' + field + ' 字段更改为：'+ value);

                $.post("/caseUseTime/editMyDes", {useTimeId: data.useTimeId, des: value}, function (res) {
                    if (res.success) {
                        layer.msg(res.message)
                        tableIns.reload();
                    } else {
                        layer.msg(res.message)
                    }
                })
            });
        });

        table.on('toolbar(useTime)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            if(checkStatus.data.length == 0){
                layer.msg('没有选中')
            }else {
                edit(checkStatus);
            }
        });

        function edit(data){
            layui.layer.open({
                title: "编辑",
                type: 2,
                move: false,
                area: ['300px', '450px'],
                content: "/caseUseTime/edit",
                success: function (layero, index) {
                    var body = layui.layer.getChildFrame('body', index);
                    try{
                        var caseNo = new Array();
                        for (var i = 0; i <data.data.length ; i++) {
                            caseNo.push(data.data[i].caseNo);
                        }
                        body.find(".caseNo").attr("value", caseNo);

                    }
                    catch(err){
                            body.find(".caseNo").attr("value", data.caseNo);
                            body.find(".useEndTime").attr("value", data.useTime);
                            body.find(".des").attr("value", data.des);
                    }
                    form.render();
                }
            })
        }

        //列表操作
        table.on('tool(useTime)', function (obj) {
            var layEvent = obj.event,
                data = obj.data;


            if (layEvent === 'edit') {
                edit(data)

            }
        });

        // var begin, end;
        //
        // //执行一个laydate实例
        // laydate.render({
        //     elem: '#begin' //指定元素
        //     , type: 'datetime'
        //     , done: function (value, date, endDate) {
        //         console.log(value);
        //         begin = value //得到日期生成的值，如：2017-08-18
        //     }
        // });
        // laydate.render({
        //     elem: '#end' //指定元素
        //     , type: 'datetime'
        //     , done: function (value, date, endDate) {
        //         console.log(value);
        //         end = value //得到日期生成的值，如：2017-08-18
        //     }
        // });
        //
        // $('#button').on('click', function () {
        //     /* 	comp=$(".comp").val();
        //         console.log(comp) */
        //     table.reload("useTime", {
        //         page: {
        //             curr: 1 //重新从第 1 页开始
        //         },
        //         where: {
        //             startTime: begin,
        //             endTime: end/* ,
		// 		  compId:comp */
        //         }
        //     })
        // });

        var useTypeId = 0;
        //用途
        form.on("select(select)", function (data) {
            id = data.value;

            // console.log(id)

            //执行重载

            table.reload('useTime', {
                url: '/caseUseTime/list'
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: {
                    useTypeId: id
                }
            });
        })

        //公司
        form.on("select(selectComp)", function (data) {
            id = data.value;

            // console.log(id)

            //执行重载

            table.reload('useTime', {
                url: '/caseUseTime/list'
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: {
                    compId: id
                }
            });
        })

        $(".like").on("click", "a", function () {
            var like = $(".like input").val();
            table.reload('useTime', {
                url: '/caseUseTime/list'
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
                , where: {
                    like: "%" + like + "%"
                }
            });
        })
    })
</script>
</body>
</html>